<HTML><HEAD>
<!--
----------
Calculator
----------
-->
<SCRIPT LANGUAGE="JavaScript"><!-- hide from old browsers
/*
THE JAVASCRIPT COOKBOOK by Erica Sadun, webrx@mindspring.com
Copyright (c)1998 by Charles River Media. All Rights Reserved.
This applet can only be re-used or modifed by license holders of the
JavaScript Cookbook CD-ROM. Credit must be given in the source
code and this copyright notice must be maintained. If you do
not hold a license to the JavaScript Cookbook, you may NOT
duplicate or modify this code for your own use.
Use at your own risk. No warranty is given or implied of the suitability
of this applet for any specific application. Neither Erica Sadun nor
Charles River Media will be held responsible for any unwanted effects
due to the use of this applet or any derivative.
*/
entry = "0"
restart = true
// Tap on a Number Key and update the current number
function tap(aform, c)
{
if (restart) // Either new start or stack just pushed
{
aform.answer.value = c
restart = false
}
else if (c == '.') // Add decimal only if unique
{
if (aform.answer.value.indexOf(".") < 0)
aform.answer.value += "."
} else if (aform.answer.value == '0') // Zero gets overwritten
{
aform.answer.value = c
}
else aform.answer.value += c // Add digit
}
// Clear the Data
function clear(aform)
{
aform.answer.value = '0'
restart = true
}
// Handle a Math Request and produce an answer
function req(aform, afunction)
{
if (entry == "") // push new value and function
{
entry = aform.answer.value + afunction
restart = true
}
else // push value, evaluate, then push function
{
// push the value onto the expression
entry += aform.answer.value
// compute the new value
var v = eval(entry)
// store the value and the function
entry = "" + v + afunction
// show the new value
aform.answer.value = "" + v
// prepare for new data entry
restart = true
}
}
// Compute the Current String
function compute(aform)
{
// evaluate and clear stack
entry += aform.answer.value
var v = eval(entry)
aform.answer.value = "" + v
entry = ""
restart = true
}
<!-- done hiding --></SCRIPT></HEAD>
<BODY bgcolor="ffffff" link="0000ff" vlink="770077">
<FONT COLOR="007777"><H1><IMG SRC="../GRAFX/UTENS.JPG" WIDTH=80 HEIGHT=50
ALIGN = CENTER>Calculator</H1></FONT>
<FONT COLOR="770000">
Keep on top of your math with this JavaScript Calculator.
</FONT></BLOCKQUOTE>
<BR><BR>
<CENTER><FORM><TABLE BORDER=1>
<TR>
<TD colspan=4
><input type="text" name="answer" value="0" size=30>
</TR>
<TR>
<TD><input type="button" value=" 7 " onClick="tap(this.form,'7')"></TD>
<TD><input type="button" value=" 8 " onClick="tap(this.form,'8')"></TD>
<TD><input type="button" value=" 9 " onClick="tap(this.form,'9')"></TD>
<TD><input type="button" value=" / " onClick="req(this.form,' / ')"></TD>
</TR>
<TR>
<TD><input type="button" value=" 4 " onClick="tap(this.form,'4')"></TD>
<TD><input type="button" value=" 5 " onClick="tap(this.form,'5')"></TD>
<TD><input type="button" value=" 6 " onClick="tap(this.form,'6')"></TD>
<TD><input type="button" value=" * " onClick="req(this.form,' * ')"></TD>
</TR>
<TR>
<TD><input type="button" value=" 1 " onClick="tap(this.form,'1')"></TD>
<TD><input type="button" value=" 2 " onClick="tap(this.form,'2')"></TD>
<TD><input type="button" value=" 3 " onClick="tap(this.form,'3')"></TD>
<TD><input type="button" value=" - " onClick="req(this.form,' - ')"></TD>
</TR>
<TR>
<TD><input type="button" value=" C " onClick="clear(this.form)"></TD>
<TD><input type="button" value=" 0 " onClick="tap(this.form,'0')"></TD>
<TD><input type="button" value=" . " onClick="tap(this.form,'.')"></TD>
<TD><input type="button" value=" + " onClick="req(this.form, ' + ')"></TD>
</TR>
<TR>
<TD> </TD>
<TD colspan=2 align=right>
<input type="button" value=" = "
onClick="compute(this.form)"></TD>
<TD> </TD>
</TR>
</TABLE></FORM></CENTER>
<BR><BR>
<FONT COLOR="007777"><H2>Discussion</H2></FONT>
<FONT SIZE=4>
This calculator stores all its numbers and operators in strings.
It uses the JavaScript <FONT COLOR="770000">eval</FONT>
function to evaluate these expressions. For example, the
result of eval("2 + 2") is 4.
JavaScript can evaluate any string which uses valid
JavaScript constructs; the statement eval("alert('hello')") is
identical in execution to alert('hello').<p>
<b>Try it out</b>. Tap on the [<b>C</b>] clear button, click
in the text entry field and delete the zero.
Now type <FONT COLOR="770000">2 + 2</FONT>
directly into the Calculator's
answer window and then press the [<b>=</b>] button.
Try typing and evaluating these other expressions.
<b>Remember</b>: [C]lear and erase the zero each time; and
remember that JavaScript is case sensitive.
<ul>
<li> 1 * 2 * 3 * 4 * 5
<li> Math.cos(3.14159)
<li> alert('hi')
</ul>
</FONT>
<h5>Copyright ©1996 by Charles River Media, All Rights Reserved</h5>
</BODY>
</HTML>